<!DOCTYPE html>
<html lang="en" xmlns:th="https://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<div class="container">
    <h1>The Goods Page</h1>
    <button onclick="doAdd()">添加商品</button>
    <br/>
    <table width="50%" class="table">
        <thead>
        <th>id</th>
        <th>name</th>
        <th>remark</th>
        <th>createdTime</th>
        <th>operation</th>
        </thead>
        <tbody>
        <tr th:each="g:${list}">
            <td th:text="${g.id}">1</td>
            <td th:text="${g.name}">MySQL</td>
            <td th:text="${g.remark}">DBMS</td>
            <td th:text="${#dates.format(g.createdTime, 'yyyy/MM/dd HH:mm')}">2020/07/03</td>
            <td><button th:onclick="doDeleteById([[${g.id}]])">delete</button></td>
            <td><button th:onclick="doFindById([[${g.id}]])">update</button></td>
        </tr>

        </tbody>
    </table>
</div>
<script>
    function doFindById(id){
        location.href=`http://localhost:8080/goods/doFindById?id=${id}`;
    }

    function doDeleteById(id){
        //Get 请求
        location.href=`http://localhost:8080/goods/doDeleteById?id=${id}`;
    }

    function doAdd(){
        location.href="http://localhost:8080/goods/doInsert";
    }

    function doUpdate(id, name, remark, createdTime){
        location.href="http://localhost:8080/goods/doUpdate"
    }
</script>
</body>
</html>